<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">

      <el-breadcrumb-item>我的</el-breadcrumb-item>
      <el-breadcrumb-item>收藏店铺</el-breadcrumb-item>

    </el-breadcrumb>
    <restaurant-card
        @handleCurrentChange="handleCurrentChange"
        @handleSizeChange="handleSizeChange"
        :restaurant="restaurant"></restaurant-card>

  </div>
</template>

<script>
import RestaurantCard from '../../components/restaurant/RestaurantCard'

export default {
  name: "Collection",
  components: {
    RestaurantCard,
  },

  data() {
    return {
      restaurant: {
        restaurantList: [],
        queryInfo: {
          query: '',
          pagenum: 1,
          pagesize: 4
        },
        total: 0,
      }
    }
  },
  created() {
    this.getRestaurantList()
  },
  methods: {
    getRestaurantList() {
      this.$axios.get("/user/mycollection",
          {
            params: {
              uid: this.$store.getters.uid,
              query:this.restaurant.queryInfo.query,
              pagenum:this.restaurant.queryInfo.pagenum,
              pagesize:this.restaurant.queryInfo.pagesize
            }
          })
          .then(response => {
            if (response.data.success) {
              this.restaurant.restaurantList = response.data.my_collection_list;
              this.restaurant.total=response.data.total;
            }

          })
          .catch(error => console.log(error));
    },
    handleSizeChange(data) {
      this.restaurant.queryInfo=data;
      this.getRestaurantList()
    },
    //监听 页码值 改变事件
    handleCurrentChange(data) {
      this.restaurant.queryInfo=data;
      this.getRestaurantList()
    },
  }
}
</script>

<style scoped>

</style>
